@page "/login"


<div class="login-container">
    <div class="login-card">
        <h2 class="text-center mb-4">系统登录</h2>
        
        <EditForm Model="@loginModel" OnValidSubmit="HandleLogin">
            <DataAnnotationsValidator />
            
            <div class="form-group">
                <label for="username">用户名</label>
                <InputText id="username" class="form-control" @bind-Value="loginModel.Username" @onblur="OnUsernameBlur" />
                <ValidationMessage For="@(() => loginModel.Username)" />
                @if (loginModel.IsUsernameError)
                {
                    <div class="validation-message">无此用户</div>
                }
            </div>
            
            <div class="form-group">
                <label for="password">密码</label>
                <InputText id="password" type="password" class="form-control" @bind-Value="loginModel.Password" />
                <ValidationMessage For="@(() => loginModel.Password)" />
                @if (loginModel.IsPasswordError)
                {
                    <div class="validation-message">密码错误</div>
                }
            </div>
            
            <!-- 显示通用错误消息 -->
            @if (!string.IsNullOrEmpty(errorMessage) && !loginModel.IsUsernameError && !loginModel.IsPasswordError)
            {
                <div class="alert alert-danger" role="alert">
                    @errorMessage
                </div>
            }
            
            <div class="form-group form-check mb-3">
                <InputCheckbox id="rememberPassword" class="form-check-input" @bind-Value="loginModel.RememberPassword" />
                <label class="form-check-label" for="rememberPassword">记住密码</label>
            </div>
            

            
            <button type="submit" class="btn btn-primary btn-block" disabled="@isLoading">
                @if (isLoading)
                {
                    <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
                    <span>登录中...</span>
                }
                else
                {
                    <span>登录</span>
                }
            </button>
        </EditForm>
    </div>
</div>